<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <!--[if lt IE 9]>
    <script type="text/javascript" th:src="@{/static/js/html5.js}"></script>
    <script type="text/javascript" th:src="@{/static/js/respond.min.js}"></script>
    <script type="text/javascript" th:src="@{/static/lib/PIE-2.0beta1/PIE_IE678.js}"></script>
    <![endif]-->
    <link th:href="@{/static/lib/layui/css/layui.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/static/css/jx-admin.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/static/lib/jx-fonts/iconfont.css}" rel="stylesheet" type="text/css"/>

    <script type="text/javascript" th:src="@{/static/lib/jquery/1.9.1/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/static/lib/layui/layui.all.js}"></script><!--弹出框插件-->
    <script type="text/javascript" th:src="@{/static/js/jx.js}"></script>
    <script type="text/javascript" th:src="@{/static/js/jx-admin.js}"></script>

    <link th:href="@{/static/lib/layui/css/layui.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/static/css/jx.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/static/css/jx-admin.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/static/lib/jx-fonts/iconfont.css}" rel="stylesheet" type="text/css"/>
    <title>Api列表</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <style rel="stylesheet" type="text/css">
        .layui-table-view .layui-table[lay-size=sm] .layui-table-cell {
            height: auto;
        }
        .x-so input.layui-input {
            width: 250px;
        }
    </style>
</head>

<body>
<div>
    <div class="x-nav">
        <span class="layui-breadcrumb" lay-separator=">">
            <a><i class="iconfont">&#xe67f;</i> 首页</a>
            <a>Api管理</a>
            <a><cite>Api列表</cite></a>
        </span>
        <!--<button class="layui-btn" style="margin-top:3px; float: right;" onclick="javascript:location.replace(location.href);"><i class="iconfont">&#xe650;</i>刷 新</button>-->
    </div>
    <div class="x-body">
        <div class="layui-row" style="background-color: #ffffff;">
            <form class="layui-form layui-col-md12 x-so">
                <div class="layui-form-item layui-input-inline">
                    <label class="layui-form-label">选择服务</label>
                    <div class="layui-input-block">
                        <select name="serviceId" id="serviceId">
                            <option value=""> 请选择 </option>
                            <option th:each="serviceId :${serviceList}" th:value="${serviceId}" th:text="${serviceId}"></option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item layui-input-inline">
                    <label class="layui-form-label">版本</label>
                    <div class="layui-input-block">
                        <select name="version" id="version">
                            <option value=""> 全部 </option>
                            <option value=""> V1.0 </option>
                            <option value=""> V2.0 </option>
                            <option value=""> V2.1 </option>
                            <option value=""> V2.2 </option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item layui-input-inline">
                    <label class="layui-form-label">关键字</label>
                    <div class="layui-input-block">
                        <input type="text" class="layui-input" autocomplete="off" name="keyword" id="keyword" placeholder="关键字：支持Tag、接口名">
                    </div>
                </div>
            </form>
        </div>
        <xblock class="xblock-middle" style="height: 30px;">
            <button class="layui-btn" id="search" name="search" style="float: right;"><i class="layui-icon">&#xe615;</i>查 询</button>
        </xblock>
        <table id="listTable" lay-filter="listTable"></table>
    </div>
</div>
    <script type="text/javascript" th:src="@{/static/lib/jquery/1.9.1/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/static/lib/layui/layui.all.js}"></script>
    <script type="text/javascript" th:src="@{/static/js/jx-admin.js}"></script>
    <script type="text/javascript" th:src="@{/static/js/md5.min.js}"></script>
    <script type="text/javascript" th:src="@{/static/js/jx.js}"></script>

    <script type="text/javascript">
        layui.use('table', function(){
            var table = layui.table;
            table.render({
                elem: '#listTable'
                ,even: true //开启隔行背景
                ,size: 'sm' //小尺寸的表格
                ,loading: true
                ,page: false //开启分页
                ,url: '[[@{/gateway/api/data/list}]]' //数据接口
                ,method: 'get'
                ,cols: [
                    [
                        {type: 'numbers', title: '序号'}
                        ,{field: 'path', title: '请求路径', width: 200}
                        ,{field: 'uri', title: 'uri'}
                        ,{field: 'order', title: 'order', width: 70}
                        ,{type: 'normal', title: '操作', width: 120}
                    ]
                ]
            });

            $("#search").click(function () {
                table.reload('listTable');
            });
        });
    </script>
</body>
</html>